<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <link rel="stylesheet" href="../static/css/layout.css">
    <link rel="stylesheet" href="../static/css/containerCss.css">
    <style>
        .el-row {
            margin-bottom: 20px;
            display: flex;
            flex-wrap: wrap
        }

    </style>
</head>
<body>
<div id="app">
    <p>未诊断病人</p>
    <el-row class=".el-row">
        <el-col :span="9">
            <el-table
                max-height="250"
                :data="tableData"
                style="width: 100%">
            <el-table-column
                    label="病历号"
                    width="180">
                <template slot-scope="scope">
                    <i class="el-icon-s-promotion"></i>
                    <span style="margin-left: 10px">{{ scope.row.registerfromId }}</span>
                </template>
            </el-table-column>
            <el-table-column
                    label="姓名"
                    width="180">
                <template slot-scope="scope">
                    <el-popover trigger="hover" placement="top">
                        <p>挂号单号: {{ scope.row.registerfromId }}</p>
                        <p>姓名: {{ scope.row.patientName }}</p>
                        <div slot="reference" class="name-wrapper">
                            <el-tag size="medium">{{ scope.row.patientName }}</el-tag>
                        </div>
                    </el-popover>
                </template>
            </el-table-column>
            <el-table-column label="操作">
                <template slot-scope="scope">
                    <el-button
                            size="mini"
                            @click="handleEdit(scope.row.registerfromId,scope.row.patientName)">看诊</el-button>
                </template>
            </el-table-column>
        </el-table>
            <p>已经诊断病人</p>
            <el-table
                    max-height="250"
                    :data="EntableData"
                    style="width: 100%">
                <el-table-column
                        label="病历号"
                        width="200">
                    <template slot-scope="scope">
                        <i class="el-icon-s-promotion"></i>
                        <span style="margin-left: 10px">{{ scope.row.registerfromId }}</span>
                    </template>
                </el-table-column>
                <el-table-column
                        label="姓名"
                        width="200">
                    <template slot-scope="scope">
                        <el-popover trigger="hover" placement="top">
                            <p>挂号单号: {{ scope.row.registerfromId }}</p>
                            <p>姓名: {{ scope.row.patientName }}</p>
                            <div slot="reference" class="name-wrapper">
                                <el-tag size="medium">{{ scope.row.patientName }}</el-tag>
                            </div>
                        </el-popover>
                    </template>
                </el-table-column>
            </el-table>
        </el-col>
        <el-col :span="6" :push="0">
                    病人名字 <el-input disabled v-model="healingForm.patientName"></el-input>
            <br>
                    病历号   <el-input disabled v-model="healingForm.descbookId"></el-input>
            <br>
                    过往病史 <el-input  v-model="healingForm.pastHis"></el-input>
            <br>
                    诊断症状<el-input  disabled v-model="healingForm.bodyDesc"></el-input>
            <br>
                    过敏史<el-input  v-model="healingForm.allergyHis"></el-input>
            <br>
                    处方<el-input disabled v-model="healingForm.preIds"></el-input>

                    <el-button type="success" round @click="submit" >诊断完毕</el-button>
            <el-button type="success" @click="refresh">刷新</el-button>
            <el-button type="success" @click="reset">重置</el-button>

        </el-col>
        <el-col :span="9" :push="0">
            <el-table
                    :data="pretableData"
                    height="250"
                    border
                    style="width: 150%">
                <el-table-column
                        prop="prescriptionId"
                        label="处方编号"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="prescriptionDesc"
                        label="处方描述"
                        width="180">
                </el-table-column>
                <el-table-column
                        prop="drugsName"
                        label="药物">
                </el-table-column>
                <el-table-column
                        label="操作">
                    <template slot-scope="scope">
                        <el-button @click="handleClick(scope.row.prescriptionDesc,scope.row.prescriptionId)" type="text" size="small">应用模板</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <br>
<!--            处方描述<el-input v-model="addPreVue.desc"></el-input>-->
<!--            <br>-->
<!--            处方药品详尽<el-input disabled v-model="addPreVue.drug_and_num"></el-input>-->
<!--            <el-select v-model="addPreVue.drug_and_num" filterable placeholder="请选择">-->
<!--                <el-option-->
<!--                        v-for="item in drugs"-->
<!--                        :key="item.drugId"-->
<!--                        :label="item.drugName"-->
<!--                        :value="item.drugId">-->
<!--                </el-option>-->

<!--            </el-select><el-input-number v-model="numDrug" :min="1" :max="10" label="描述文字"></el-input-number>-->
<!--            <br>-->
<!--            <el-button type="primary" @click="drugAnDnum" round>添加药物</el-button>-->
<!--            <br>-->
<!--            <br>-->
<!--            <el-button type="primary" round @click="submitPres">提交处方模板</el-button>-->
        </el-col>
    </el-row>

</div>
</body>

<!--axios min-->
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<!-- import Vue before Element -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript
{
                drugId: '1',
                drugName: '999感冒灵'
            }, {
                drugId: '2',
                drugName: '维C银翘片'
            }, {
                drugId: '3',
                drugName: '金鸡胶囊'
            }, {
                drugId: '6',
                drugName: '金猪胶囊'
            }, {
                drugId: '9',
                drugName: '烤鸭'
            }
-->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
    var preData=[]
    var data01=[]
    var data02=[]
    var drugArr=[]
var app=new Vue({
    el:'#app',
    data() {
        return {
            addPreVue:{
                desc:"",
                drug_and_num:""
            },
            drugs: [],
            healingForm:{
                patientName:'',
                descbookId:'',
                pastHis:'',
                bodyDesc:'',
                allergyHis:'',
                preIds:''
            },
            selectorIndex: '',
            numDrug:0,
            registerFormid:0,
            pastSymptom:'',
            allergy:'',
            symptom:'',
            fdy:"fdy",
            tableData: [],
            EntableData: [],
            pretableData:[]
        }
    },
    created() {
        axios.get("http://localhost:8900/doc/showUn").then(function (request) {
            var jsp=request.data;
            console.log(request)
            for (var value of jsp) {
                let temp={registerfromId:"",patientName:""};
                temp.registerfromId=value.registerfromId
                temp.patientName=value.patientName
                data01.push(temp);
            }


        })
        axios.get("http://localhost:8900/doc/showPre").then(function (request) {
            var jsp=request.data;
            console.log(request)
            for (var value of jsp) {
                let temp={prescriptionId:0,prescriptionDesc:"",drugsName:""};
                temp.prescriptionId=value.prescriptionId
                temp.prescriptionDesc=value.prescriptionDesc
                temp.drugsName=value.drugsName
                preData.push(temp);
            }


        })
        axios.get("http://localhost:8900/doc/showDrug").then(function (request) {
            var jsp=request.data;
            console.log(request)
            for (var value of jsp) {
                let temp={drugId:0,drugsName:""};
                temp.drugId=value.drugId
                temp.drugsName=value.drugsName
                drugArr.push(temp);
            }


        })



    },
    mounted() {
        axios.get("http://localhost:8900/doc/showEn").then(function (request) {
            var jsp=request.data;
            for (var value of jsp) {
                let temp={registerfromId:"",patientName:""};
                temp.registerfromId=value.registerfromId
                temp.patientName=value.patientName
                data02.push(temp);
            }


        })
        this.refresh()
    },
    methods: {
        submitPres:function(){
            axios.post("http://localhost:8900/doc/createPre",this.addPreVue).then(function (response) {


            }),function (err) {
                console.log(err)
            }
        }
        ,
        reset(){
            this.healingForm.preIds=''
            this.healingForm.patientName=''
            this.healingForm.descbookId=''
            this.healingForm.pastHis=''
            this.healingForm.bodyDesc=''
            this.healingForm.allergyHis=''


        },
        re02:function(){
            axios.get("http://localhost:8900/doc/showEn").then(function (request) {
                var jsp=request.data;
                data02=[]
                for (var value of jsp) {
                    let temp={registerfromId:"",patientName:""};
                    temp.registerfromId=value.registerfromId
                    temp.patientName=value.patientName
                    data02.push(temp);
                }


            })
        },
        re01:function(){
            axios.get("http://localhost:8900/doc/showUn").then(function (request) {
                var jsp=request.data;
                console.log(request)
                data01=[];
                for (var value of jsp) {
                    let temp={registerfromId:"",patientName:""};
                    temp.registerfromId=value.registerfromId
                    temp.patientName=value.patientName
                    data01.push(temp);
                }
                console.log('233')
                console.log(data01);

            })
        },
        refresh:function(){
            this.drugs=drugArr
          this.tableData=data01
          this.EntableData=data02
            this.pretableData=preData
        },
        drugAnDnum(){
          this.addPreVue.drug_and_num=this.addPreVue.drug_and_num+','+this.numDrug
        },
        del:function (_arr, _obj) {
            var length = _arr.length;
                for (var i = 0; i < length; i++) {
                    if (_arr[i] == _obj) {
                        if (i == 0) {
                            _arr.shift(); //删除并返回数组的第一个元素
                            return _arr;
                        }
                        else if (i == length - 1) {
                            _arr.pop();  //删除并返回数组的最后一个元素
                            return _arr;
                        }
                        else {
                            _arr.splice(i, 1); //删除下标为i的元素
                            return _arr;
                        }
                    }
                }

        }
        ,
        handleEdit(regisID,patientName) {
            this.healingForm.descbookId=regisID
            this.healingForm.patientName=patientName
            this.tableData.shift();

            data02.push({descbookId:regisID,
                patientName:patientName})

        },
        handleDelete(index, row) {
            console.log(index, row);
        },
        handleClick(desc,id){
            this.healingForm.bodyDesc=desc
            this.healingForm.preIds=id

        },
        submit(){
            axios.post("http://localhost:8900/doc/healingForm",this.healingForm).then(function (response) {


            }),function (err) {
                console.log(err)
            }
            location.reload([bForceGet=true])

        }

    }
})
</script>
</html>
